<template>
  <div class="back-nav">
    <van-nav-bar
      :title="title"
      :left-text="leftText"
      :right-text="rightText"
      :left-arrow="leftArrow"
      @click-left="back"
      @click-right="onClickRight"
    />
  </div>
</template>

<script>
export default {
  name: "BackNav",
  props: {
    title: {
      type: String,
      default: "",
    },

    leftArrow: {
      type: Boolean,
      default: false,
    },

    leftText: {
      type: String,
      default: "",
    },

    rightText: {
      type: String,
      default: "",
    },
  },

  methods: {
    back() {
      this.$router.go(-1);
    },
    onClickRight() {
      if (this.rightText == "编辑") {
        this.$emit("toggle","完成");
      }else{
         this.$emit("toggle","编辑");
      }
    },
  },
};
</script>

<style lang="less" scoped>
@import url("../assets/base.less");
.back-nav {
  /deep/ .van-nav-bar .van-icon {
    color: @mainColor;
  }

  /deep/ .van-nav-bar__text {
    color: @mainColor;
  }
  /deep/ .van-nav-bar__right {
    .van-nav-bar__text {
      color: #707786;
    }
  }
}
</style>